<!DOCTYPE html
   PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no,mail=yes">
   <title>Index</title>

   <script src="./js/jquery-1.8.3.min.js"></script>
   <script src="./js/swiper.min.js"></script>
   <link rel="stylesheet" href="./layui/css/layui.css">
   <link rel="stylesheet" href="./css/iconfont.css">
   <link rel="stylesheet" href="./css/animate.css">
   <link rel="stylesheet" href="./css/swiper.min.css">
   <link rel="stylesheet" href="./css/common.css">
   <link rel="stylesheet" href="./css/index.css">
   <script src="./js/wow.min.js"></script>
   <script type="text/javascript" src="./js/clipboard.min.js"></script>
   <script type="text/javascript" src="./layui/layui.js"></script>
</head>

<body>
   <header class="headerpage " data-load="header"></header>
   <main class="user_page  ">
      <section class="">
         <div class="layui-main">
            <div class="user_con">
               <div class="user_headpage" data-load="user_active_header"></div>
               <div class="right_main ">
                  <p class="ft24 mb10 ft-bold">活動通知</p>
                  <p class="ft14 gary_c9 mb20 ft-bold">活動通知發送給報名人，並非發送給所有參加人（報名人可能幫其他參加人報名）</p>
                  <div class="block_com" style="min-height: 70vh;">
                     <form class="layui-form layui-row layui-col-space40">
                        <div class="layui-col-md6 layui-col-xs12">
                           <div class="layui-form-item">
                              <div class="label must">寄件人</div>
                              <div class="">
                                 <input type="text" name="username" lay-verify="required" placeholder="回复的Email"
                                    autocomplete="off" class="layui-input">
                              </div>

                           </div>
                           <div class="layui-form-item">
                              <div class="label must">信件內容</div>
                              <div class="">
                                 <input type="text" name="username" lay-verify="required" placeholder="信件标题"
                                    autocomplete="off" class="layui-input">
                              </div>

                           </div>
                           <div class="layui-form-item">
                              <div class="label ">
                                 <p class="tip1">以下為【123】於【werwe 】發給你的活動通知：</p>
                              </div>

                              <textarea class="layui-textarea" style="height: 3rem;"></textarea>
                           </div>
                        </div>
                        <div class="layui-col-md6 layui-col-xs12">
                           <div class="label ">發送對象
                              <p class="tip1">我們只向符合條件的報名人 ACCUPASS 帳號發送活動通知，並不會通知報名表中 填寫的參加人。</p>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must"><span class="ft12">发送对象</span></div>
                              <div class="">
                                 <select>
                                    <option>所有报名成功者</option>
                                 </select>
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must"><span class="ft12">发送人数</span></div>
                              <div class="tac orange_c mt10 ">
                                 <span class="ft30 line1">6</span>人
                              </div>
                           </div>
                           <div class="layui-form-item">
                              <input type="checkbox" name="like[write]" title="排程發送">
                              <p class="ft12 gary_c9">根據你的預定時間，我們將向符合條件的人發送通知，但由於報名情況的變動，最 終通知的接收人數可能增加或減少</p>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must"><span class="ft12">排程日期</span></div>
                              <div class="">
                                 <input type="text" class="layui-input" id="ID-laydate-shortcut-date">

                              </div>
                           </div>
                           <div class="layui-form-item">
                              <div class="label must"><span class="ft12">*排程时间</span></div>
                              <div class="">
                                 <input type="text" class="layui-input" id="ID-laydate-shortcut-range-time"
                                    placeholder=" - ">
                              </div>
                           </div>
                        </div>
                        <div class="d-flex w100">
                           <div class="mr20 flex-1">
                              <button
                                 class="w100 layui-btn layui-btn-lg  layui-btn-primary layui-border-orange layui-btn-radius">储存</button>
                           </div>
                           <div class="flex-1">
                              <button class="w100 layui-btn layui-btn-lg layui-bg-orange layui-btn-radius">发送信件</button>
                           </div>
                        </div>
                     </form>
                  </div>
               </div>
            </div>
         </div>
      </section>
   </main>

</body>
<script src="./js/index.js"></script>
<script>

   layui.use(['form', 'laydate', 'util'], function () {
      var form = layui.form;
      var layer = layui.layer;
      var laydate = layui.laydate;
      var util = layui.util;

      // 日期
      laydate.render({
         elem: "#ID-laydate-shortcut-date",
         shortcuts: [
            {
               text: "昨天",
               value: function () {
                  var now = new Date();
                  now.setDate(now.getDate() - 1);
                  return now;
               }
            },
            {
               text: "今天",
               value: function () {
                  return Date.now();
               }
            },
            {
               text: "明天",
               value: function () {
                  var now = new Date();
                  now.setDate(now.getDate() + 1);
                  return now;
               }
            },
            {
               text: "上个月",
               value: function () {
                  var now = new Date();
                  var month = now.getMonth() - 1;
                  now.setMonth(month);
                  // 若上个月数不匹配，则表示天数溢出
                  if (now.getMonth() !== month) {
                     now.setDate(0); // 重置天数
                  }
                  return [now];
               }
            },
            {
               text: "下个月",
               value: function () {
                  var now = new Date();
                  var month = now.getMonth() + 1;
                  now.setMonth(month);
                  // 若下个月数不匹配，则表示天数溢出
                  if (now.getMonth() !== month) {
                     now.setDate(0); // 重置天数
                  }
                  return [now];
               }
            },
            {
               text: "某一天",
               value: "2016-10-14"
            }
         ]
      }); laydate.render({
         elem: "#ID-laydate-shortcut-range-time",
         type: "time",
         range: true,
         shortcuts: [
            {
               text: '09:30 <p style="text-align: center;">到</p> 11:30',
               value: (function () {
                  var date1 = new Date();
                  date1.setHours(9, 0, 0, 0);
                  var date2 = new Date();
                  date2.setHours(11, 30, 0, 0);
                  return [date1, date2];
               })
            },
            {
               text: '13:00 <p style="text-align: center;">到</p> 15:00',
               value: (function () {
                  var date1 = new Date();
                  date1.setHours(13, 0, 0, 0);
                  var date2 = new Date();
                  date2.setHours(15, 0, 0, 0);
                  return [date1, date2];
               })
            }
         ]
      });
   })

</script>

</html>